<template>
	<div>
		<h1 v-text="msg" ref="title"></h1>
		<School ref="sch"></School>
		<button ref="btn" type="button" @click="showDOM">点我输出上方的dom元素</button>
	</div>
</template>

<script>
	// 引入School组件
	import School from "./components/School.vue"
	export default {
		name:"App",
		components:{
			School
		},
		data(){
			return {
				msg:"欢迎使用Vue脚手架"
			}
		},
		methods:{
			showDOM(){
				console.log(this.$refs.title) // 真实dom元素
				console.log(this.$refs.sch)  // School 组件的实例对象
				console.log(this.$refs.btn)  // 真实的Dom元素
			}
		}
	}
</script>

<style>
</style>
